<html lang="zh" xmlns:th="http://www.thymeleaf.org">

<head>
    <th:block th:include="include :: touchScreenHeader('办事指南')"/>
    <style>
        #dialog1 {
            position: fixed;
            left: 3%;
            top: 170px;
            width: 94%;
            height: 780px;
            background: rgba(94, 110, 141, .9)
        }

        .popup {
            margin-top: 240px !important;
        }

        .popup li {
            float: none;
            width: 100%;
        }

        .popup li a {
            width: 40%;
            margin-left: 30%;
            padding-left: 0;
            text-align: center;
        }

        .img-replace {
            display: block;
            width: 40px;
            color: #fff;
            font-size: 40px;
            height: 40px;
            float: right;
            margin-right: 1em;
            margin-top: 40px;
            background: url(/touchscreenstyle/images/close.png);
            background-size: 100%;
        }

        .popup li:nth-child(2) a {
            box-shadow: inset 0 -4px 0 #1a87bb;
            background: #2ea7e0;
            border-color: #249ad2;
        }
    </style>

</head>
<body>
<div class="header">
    <img id="sitefav" src="/touchscreenstyle/images/logo2.png"/>
    <div class="time" id="clock">
        <p class="date">{{ date }}</p>
        <p class="time1">{{ time }}</p>
    </div>
</div>
<div class="main">
    <!-- <div class="zhanshi">
         <img src="images/a1.png"/>
     </div>-->
    <div>
        <!--<p class="pingtit">办事指南</p>-->
        <div class="con">
            <ul class="zhinan-btn">
                <li th:each="item:${guidanceList}"><a class="btn  btn-lg"
                                                      th:onclick="'openSec('+${item.tsGuidanceId}+')'">[[${item.guidanceName}]]</a>
                </li>
            </ul>
        </div>
    </div>
    <!--    href="guidanceList/1"-->
    <!--    href="guidanceList/2"-->
    <!--    href="guidanceList/3"-->
    <!--    href="guidanceList/4"-->
    <!--    href="guidanceList/5"-->
    <!--    href="guidanceList/6"-->
    <!--<ul class="an">-->
    <!--<li class="next"><a href="#"><img src="images/gr.png"/></a></li>-->
    <!--<li class="fan"><a href="#"><img src="images/or.png"></a></li>-->
    <!--</ul>-->
</div>
<div class="weui_tabbar">
    <a href="/touchscreen/index" class="weui_tabbar_item">
        <div class="weui_tabbar_icon hig20">
            <i class="fa fa-map"></i>
        </div>
        <p class="weui_tabbar_label">指引地图</p>
    </a>
    <a href="/touchscreen/jieshao" class="weui_tabbar_item">
        <div class="weui_tabbar_icon hig20">
            <i class="fa fa-star-o"></i>
        </div>
        <p class="weui_tabbar_label">中心介绍</p>
    </a>
    <a href="/touchscreen/nan" class="weui_tabbar_item weui_bar_item_on">
        <div class="weui_tabbar_icon hig20">
            <i class="fa fa-telegram"></i>
        </div>
        <p class="weui_tabbar_label">办事指南</p>
    </a>
    <a href="/touchscreen/notice" class="weui_tabbar_item">
        <div class="weui_tabbar_icon hig20">
            <i class="fa fa-list"></i>
        </div>
        <p class="weui_tabbar_label">公示公告</p>
    </a>
</div>
<div id="dialog1" style="display:none;">
    <p><a class="img-replace" id="btn_close"></a></p><!--cd-popup-close-->
    <ul class="zhinan-btn popup">
        <li><a class="btn btn-lg" id="sxblzn">事项办理指南</a></li>
        <li><a class="btn btn-lg" id="sxsfwb">事项示范文本</a></li>
        <li><a class="btn btn-lg" id="kbwb">空白文本</a></li>
    </ul>
</div>
<th:block th:include="include :: touchScreenFooter"/>
<script>
    shijian();
    function openSec(obj) {
        console.log(obj);
        $("#sxblzn").attr("href", "guidanceList/" + obj + "/Z");
        $("#sxsfwb").attr("href", "guidanceList/" + obj + "/W");
        $("#kbwb").attr("href", "guidanceList/" + obj + "/K");
        $("#dialog1").show();
    }

    $("#btn_close").on("click", function () {
        $("#dialog1").hide();
    })
</script>
</body>
</html>
